<template>
    <div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-body layui-table-body layui-table-main">
                            <table class="layui-table layui-form">
                                <thead>
                                <tr>
                                    <th>名称</th>
                                    <th>姓名</th>
                                    <th>类型</th>
                                    <th>手机</th>
                                    <th>管理员</th>
                                    <th>地址</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr v-for="item in clientData">
                                    <td>
                                        {{item.client}}
                                    </td>
                                    <td>
                                        {{item.name}}
                                    </td>
                                    <td>
                                        {{item.type}}
                                    </td>
                                    <td>
                                        {{item.phone}}
                                    </td>
                                    <td>
                                        {{item.client_eid}}
                                    </td>
                                    <td>
                                        {{item.province}}{{item.city}}{{item.district}}
                                    </td>
                                    <td class="td-manage">
                                        <a title="恢复" class="layui-btn" @click.stop="recovery(item.id,item.client)" href="javascript:;">
                                            <i class="layui-icon">恢复</i>
                                        </a>&nbsp
                                        <a title="彻底删除" class="layui-btn layui-btn-danger" @click="del(item.id,item.client)" href="javascript:;">
                                            <i class="layui-icon">彻底删除</i>
                                        </a>
                                    </td>

                                </tr>
                                </tbody>
                            </table>
                            <my-page :total="count" v-if="showPage"></my-page>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>

    import { mapActions, mapState } from "vuex";
    import memberedit from './member-edit';
    import page from './pagination5'
    import memberadd from './member-add'

    export default {
        data(){
            return{
                searchInfo:"",
                showPage:true
            }
        },
        name: "clientdrop",
        components:{
            'my-page':page
        },
        created() {
            this.getClientsDrop();
            this.getClientsDropCounts();
        },
        computed:{
            ...mapState({
                clientData:state=>state.clientDropData,
                count:state=>state.clientDropCount,
            })
        },
        methods:{

            del(obj,id,client){
                let vm = this;
                layer.confirm('确认删除 '+client+' ？',function(){
                    vm.deleteClient(id);
                    setTimeout(vm.getClients,500);
                    setTimeout(vm.getClientsCounts,500);
                });
            },
            recovery(id,name){
                let vm = this;
                layer.confirm('恢复 '+name+' 至正常客户列表？',function(){
                    vm.recoveryclient(id);
                    setTimeout(vm.getClients,500);
                    setTimeout(vm.getClientsCounts,500);
                    vm.$layer.alert("已恢复"+name+"到正常客户列表");
                });
            },
            ...mapActions(["getClientsDrop","getClientsDropCounts","deleteClient","recoveryclient"])
        },
        mounted(){
        },
    }


</script>

<style scoped>

</style>